/*
|-------------------------------------------------------------------------------
| VUEX modules/cafes.js
|-------------------------------------------------------------------------------
| The Vuex data store for the cafes
*/

/**
 * Vuex 四个状态： state 、 actions 、 mutations 、 getters
 * 流程 ：
 * 用户调用一个 action
 * 该 action 加载/计算数据
 * 该 action 提交一个 mutation
 * state 被更新
 * getter 将更新后的 state 返回给组件
 * 组件被更新
 * 
 * cafesLoadStatus, cafeLoadStatus 数据状态
 * status = 0 -> 数据尚未加载
 * status = 1 -> 数据开始加载
 * status = 2 -> 数据加载成功
 * status = 3 -> 数据加载失败
 */

import CafeAPI from '../api/cafe.js';
export const cafes = {
    /**
     * Defines the state being monitored for the module.
     */
    state: { //存储所有状态
        cafes: [], //所有对象
        cafesLoadStatus: 0,
        cafe: {}, //单个对象
        cafeLoadStatus: 0,

        cafeAddStatus: 0
    },
    /**
     * Defines the actions used to retrieve the data.
     */
    actions: { //计算
        loadCafes({ commit }) {
            commit('setCafesLoadStatus', 1);
            CafeAPI.getCafes()
                .then(function(response) {
                    commit('setCafes', response.data);
                    commit('setCafesLoadStatus', 2);
                })
                .catch(function() {
                    commit('setCafes', []);
                    commit('setCafesLoadStatus', 3);
                });

        },
        loadCafe({ commit }, data) {
            commit('setCafeLoadStatus', 1);
            CafeAPI.getCafe(data.id)
                .then(function(response) {
                    commit('setCafe', response.data);
                    commit('setCafeLoadStatus', 2);
                })
                .catch(function() {
                    commit('setCafe', {});
                    commit('setCafeLoadStatus', 3);
                });

        },
        addCafe({ commit, state, dispatch }, data) {
            // 状态1表示开始添加
            commit('setCafeAddStatus', 1);

            CafeAPI.postAddNewCafe(data.name, data.address, data.city, data.state, data.zip)
                .then(function(response) {
                    // 状态2表示添加成功
                    commit('setCafeAddStatus', 2);
                    dispatch('loadCafes');
                })
                .catch(function() {
                    // 状态3表示添加失败
                    commit('setCafeAddStatus', 3);
                });
        }
    },
    /**
     * Defines the mutations used
     */
    mutations: { //所有 mutations 所做的工作都是设置（更新）state，所以第一个参数是 state。第二个参数是 state 更新后的数据
        setCafesLoadStatus(state, status) {
            state.cafesLoadStatus = status;
        },
        setCafes(state, cafes) {
            state.cafes = cafes;
        },
        setCafeLoadStatus(state, status) {
            state.cafeLoadStatus = status
        },
        setCafe(state, cafe) {
            state.cafe = cafe;
        },
        setCafeAddStatus(state, status) {
            state.cafeAddStatus = status;
        }

    },
    /**
     * Defines the getters used by the module
     */
    getters: { //getters 从模块中获取数据，给组件渲染。
        getCafesLoadStatus(state) {
            return state.cafesLoadStatus;
        },
        getCafes(state) {
            return state.cafes;
        },
        getCafeLoadStatus(state) {
            return state.cafeLoadStatus;
        },
        getCafe(state) {
            return state.cafe;
        },
        getCafeAddStatus(state) {
            return state.cafeAddStatus;
        }
    }
}